<template>
  <div class="newsdetail_page">
      <van-nav-bar
      title="消息详情"
      left-arrow
      @click-left="onClickLeft"
    />

    <div class="info">
        <div class="top">
            <div class="l">
                <p>系统通知</p>
                <p>发布人：{{dataArr.sourceName}}</p>
            </div>
            <div class="r">2018年3月10日 23:15</div>
        </div>
        <div class="down">
            <p>1.修复了一些问题</p>
            <p>2.字体显示效果优化</p>
            <p>3.非WiFi网络下提醒优化</p>
        </div>
    </div>

  </div>
</template>

<script>
import {newsCenterDetailApi,HasReadApi} from '../../request/api'

export default {
  data(){
    return {
      dataArr:{},
    }
  },
    methods:{
        onClickLeft(){
            this.$router.back()
        }
    },
    created(){
      let id = this.$route.params.id
      console.log(id);
      newsCenterDetailApi(id).then(res=>{
        console.log(res);
        this.dataArr = res.data;
      })

      //是否已读
        let datas = {
        id:this.$route.params.id,
      }

      let formData = new FormData();
      for(let key in datas){
        formData.append(key,datas[key]);
      }

      HasReadApi(formData).then(res=>{
        console.log(res);
      })




    }

}
</script>

<style lang="less" scoped>
.newsdetail_page{
    width: 100vw;
    height: 100vh;
    background-color: #f5f5f5;
}

/deep/.van-nav-bar {
  width: 100vw;
  height: 45px;
  background-color: #039;
  .van-icon {
    color: #fff;
    font-size: 16px;
  }
  .van-nav-bar__title {
    color: #fff !important;
    font-size: 16px;
  }
  .van-nav-bar__right {
    .van-nav-bar__text {
      color: #fff;
      font-size: 16px;
    }
  }
}

.info{
    background-color: #fff;
    margin-top: 10px;
    .top{
        display: flex;
        justify-content: space-between;
        padding: 15px;
        .l{
            p{
                &:nth-of-type(1){
                    font-weight: 500;
                }
                &:nth-of-type(2){
                    margin-top: 8px;
                    color: #999;
                     font-size: 14px;
                   
                }
            }
        }
        .r{
             font-size: 12px;
                    color: #999;
        }
    }

    .down{
         padding: 0 15px 15px;
         p{
               font-size: 14px;
             height: 25px;
             line-height: 25px;
             color: #999;
         }


    }
}


</style>